<%--
  Created by IntelliJ IDEA.
  User: sofwin
  Date: 2021/7/12
  Time: 11:44
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%String path = request.getContextPath() + "/";%>
<!doctype html>
<html>
<head>
    <base href="<%=path%>">
    <title>用户列表</title>
<%@include file="/header.jsp"%>
    <link href="bootstrap/css/plugins/switchery/switchery.css" rel="stylesheet">
    <script src="bootstrap/js/plugins/switchery/switchery.js"></script>
    <script src="bootstrap/js/plugins/iCheck/icheck.min.js"></script>
</head>
<style>
</style>
<body style="background-color: #f3f3f4">
<div class="container" style="width: 100%;">
    <div class="row" style="height:680px;" id="container">
        <div class="col-md-12" id="right">
            <div class="row"
                 style="background-color: #ffffff;box-shadow: 1px 1px 3px rgba(0,0,0,.2);margin: 10px 10px;padding:10px 10px;border-radius: 10px;line-height: 50px;">
                <form class="form-inline">
                    <div class="form-group">
                        <label>部门名称</label>
                        <input type="text" class="form-control" name="loginAccount" id="loginAccount" placeholder="">
                    </div>
                    <button type="button" class="btn btn-primary query">
                        <i class="fa fa-search"></i> 搜索
                    </button>
                    <button type="reset" class="btn btn-warning">
                        <i class="fa fa-refresh"></i>
                        重置
                    </button>
                </form>
            </div>
            <div class="row"
                 style="background-color: #ffffff;box-shadow: 1px 1px 3px rgba(0,0,0,.2);margin: 10px 10px;padding:10px 10px;border-radius: 10px;">
                <div id="toolbar">
                    <button class="btn btn-primary" id="add">
                        <i class="fa fa-plus" aria-hidden="true">&nbsp;</i>新增
                    </button>
                    <button id="edit" class="btn btn-success">
                        <i class="fa fa-pencil fa-fw"> &nbsp;</i>编辑
                    </button>
                    <button id="remove" class="btn btn-danger">
                        <i class="fa fa-trash-o fa-fw"> &nbsp;</i>删除
                    </button>
                    <button id="closeOrOpen" class="btn btn-info">
                        <i class="fa fa-trash-o fa-fw"> &nbsp;</i>展开/折叠
                    </button>
                </div>
                <table id="userData"></table>
            </div>
        </div>
    </div>
</div>



</body>
<script>
    var $table=$('#userData')
    var flag=1;
    $(function(){
        $("#add").click(function(){
            $.modal.open('新增部门','view/dept/edit',"500px","500px");
        })

        $("#closeOrOpen").click(function(){
            if(flag==1){
                _table.treegrid('collapseAll');
                flag=0;
            }else{
                _table.treegrid('expandAll');
                flag=1;
            }
        })

        function initTree(){
            let columns=[
                {
                    checkbox: true
                },
                {
                    field: 'name',
                    title: '部门名称'
                },
                {
                    field: 'deptSort',
                    title: '部门排序'
                },
                {
                    field: 'status',
                    title: '状态',
                    sortable: true,
                    align: 'center',
                    formatter:function (value) {
                        if(value==1){
                            return "<span class=\"label label-success\">启用</span>";
                        }else{
                            return "<span class=\"label label-danger\">禁用</span>";
                        }
                    }
                },
                {
                    title: '操作',
                    width: '150px',
                    align: 'center',
                    formatter: function (value, row, index) {
                        // 当前行的数据
                        // 当前循环的次数
                        return '<a href="javascript:void(0)" onclick="edit(' + row.id + ')" class="edit" title="编辑部门"><i class="fa fa-pencil"></i></a>&nbsp;&nbsp;<a href="javascript:void(0)" onclick="deleteUser('+row.id+')" title="删除部门"><i class="fa fa-trash-o"></i></a>';
                    }
                }
            ];
            $.modal.initTreeTable('dept/data',columns,"id","name","pid");
        }
        initTree();

    })
    //
    function edit(id){
        $.modal.open("编辑部门信息",'view/dept/edit?id='+id,"500px","400px");
    }
</script>
</html>
